<#import "../layout/common.html" as com> 
<@com.page title="Ghép tên" pageId="pageGhepTen" data={'css':'ghep/ghep', 'js':'ghep/ghep', 'ver':'a08'}>

<div class="wrap-space">
<div class="panel panel-default head-tab">
	<div class="panel-heading">
		<ul class="nav nav-tabs">
			<li class="active"><a href="#ghepTab" data-toggle="tab">Ghép tên</a></li>
			<li class=""><a href="#xemTab" data-toggle="tab" id="xemTabButton" class="hide">Xem thư</a></li>
		</ul>
	</div>
	<div class="tab-content">
		<div class="tab-pane active" id="ghepTab">
			<form role="form" id="ghepTenForm" class="form-horizontal form-space" action="" method="get">
				<#if img??>
				<div class="form-group photo-wrap">
					<a href="${img}?download=1" target="_blank" class="go-ext"><img src="${img}" class="photo"/>
						<br/><span>Ghép tên <strong>${me?html}</strong> và <strong>${you?html}</strong></span>
					</a>
				</div>
				</#if>
				<div class="form-group">
					<label for="myName" class="col-sm-2 control-label">Tên bạn</label>
					<div class="col-sm-10">
						<input type="text" class="form-control" name="me" id="myName" placeholder="Tên bạn" value="${(me!"")?html}">
						<label class="checkbox-inline hide"><input type="checkbox" id="inlineCheckbox1" value="option1"> Giấu tên bạn</label>
					</div>
				</div>
				<div class="form-group">
					<label for="yourName" class="col-sm-2 control-label">Tên người ấy</label>
					<div class="col-sm-10">
						<input type="text" class="form-control" name="you" id="yourName" placeholder="Tên người ấy"  value="${(you!"")?html}">
					</div>
				</div>
				
				<div class="form-group hide">
					<label for="message" class="col-sm-2 control-label">Lời nhắn</label>
					<div class="col-sm-10">
						<textarea class="form-control" rows="3" name_="message" id="message" placeholder="Lời nhắn"></textarea>
					</div>
				</div>
				
				<div class="form-group">
					<div class="col-sm-offset-2 col-sm-10">
						<button type="submit" class="btn btn-default">Bắt đầu tạo</button>
					</div>
				</div>
			</form>
		</div>
		<div class="tab-pane " id="xemTab">
			<div class="thu-tay">
				<div class="paper">
					<div class="date">Địa cầu, ngày 22 tháng 7, năm 2014</div>
					<div class="greet">Gửi: <span class="receiver">Hoàng Dung</span></div>
					<div class="content">
						<img src="http://stc.ola.vn/files/ghep-ten/k_t00000.jpg" class="photo"/>
						<div class="message">Không ham địa vị giàu sang<br>Chẳng mơ mà được chẳng cần mà nên<br>Tình yêu cần trách đảo điên<br>Khen ai khéo nết thành đôi vợ chồng</div>
					</div>
					<div class="sign">Ký tên: <span class="sender">Vô Danh</span></div>
				</div>
			</div>
		</div>
	</div>
</div>
</div>

</@com.page>